<template>
    <div class="container">
    <div>
            <h1>农产品详情</h1>
        <div class="top">
            <div style="display:flex;justify-content: center;">
                 <img v-for="(item,index) in photos" :key="index" :src="item" alt="">
            </div>
            <!-- <div>
                 <img src="../../assets/404_images/xiong2.jpeg" alt="">
            </div>       -->
        </div>
       <div class="center">
           <div>
               收货地址：{{params.address}}
           </div>
           <div>
               农产品名称：{{params.name}}
           </div>
            <div>
               价格：{{params.price}}
           </div>
            <div>
               保质期：{{param.quality?param.quality:'暂无'}}
           </div>
            <div>
               备注：{{param.remark?param.remark:'暂无'}}
           </div>
           <div>
               时间：{{param.time?param.time:'暂无'}}
           </div>

       </div>
       <div class="bottom">
           注意事项：海南地处热带，光温水源充足，不仅有利于作物生长，也有利于病虫害的繁殖、扩散，因此，在作物种植的过程中，为了保证作物的正常生长，种植户们少不了要用到一些农药，
           也就有可能会出现农药残留。农药残留是指在农业生产中施用农药后，一部分农药直接或间接残存于谷物、蔬菜、果品中以及土壤和水体中的现象。
       </div>
    </div>
    </div>
</template>
<script>
import {get,post,get1} from '../../store/axios'
export default {
    data(){
        return{
            param:{},
            photos:[]
        }
    },
    created(){
        this.param = this.$route.params
        this.params = this.param.Id
        console.log('====', this.params)
        this.lookPhoto()
    },
    methods:{
        lookPhoto(){
             post('greenHouse/files_geturl',{id:this.param.Id.id,}).then((result)=>{
                 this.photos = result.data.urls
            })
        }
    }
}
</script>
<style>
    h1{
        margin: 0.67em 47px;
    }
    .top{
        display: flex;
        justify-content: space-around;
    }
    .container{
        padding: 20px;
    }
    .bottom{
        color: rgb(165, 100, 14);
        font-size: 13px;
        width: 1100px;
        margin-left: 50px;
        font-size: 25px;
    }
    .center{
         display: flex;
        justify-content: space-around;
        margin-top: 10px;
        color: cadetblue;
        margin-bottom:10px;
        font-size: 20px;
         padding: 50px;
    }
    img{
        width: 300px;
        margin-left: 20px;
    }
</style>